<template>

  <div id="orderlist">
	  <div v-for="item in arr">
	  	<order-list class="mb10" v-bind:orderdata="item" ></order-list>
	  </div>

	  <!-- <div class="more" v-if="hasmore" v-on:click="more()">
	  		查看更多
	  </div> -->

	  <yd-button size="large" type="hollow" v-if="hasmore" @click.native="more()" >查看更多</yd-button>

	  <div style="height:70px;width:100%;"></div>
  </div>

</template>

<script>

import { mapGetters, mapActions } from 'vuex'
import olist from './order_list'


export default {
  	name: 'Order',
  	data () {
    	return {
			msg: '订单',
			topStatus : '', 
			allLoaded : false,
			pageNo: 0,
			pageSize: 5,
			arr : new Array(),
			hasmore : false,
    	}
  	},

	computed: {
	// ...mapGetters([
	//     'orderlist',
	// ]),

	},

  	methods: {

  		more () {
  			console.log('more');
  			this.pageNo += 1;
		  	this.$store.dispatch('orderList', {
	  			para : {
	  				pageNo : this.pageNo,
	  				pageSize : this.pageSize,
	  				pay_state : '1',
	  			},
		  		'callback' : (ol) => {
		  			if(this.pageNo == ol.totalPage){
		  				this.hasmore = false;
		  			}else{
		  				this.hasmore = true;
		  			}
		  			if(ol.results != undefined){
			    		this.arr =  this.arr.concat(ol.results);
			    	}
		  		}
		  	});
  		}
  	},

	created () {
		console.log('created');
		this.arr = [];
		this.more();
	},

	components : {
		'order-list' : olist,
	}

}
</script>

<style scoped>

#orderlist {
	margin-bottom: 60px;
}

.more {
	width: 100%;
	height: 50px;
	line-height: 50px;
	float: left;
	text-align: center;
}

</style>
